body { line-height: 1.5; font-size: 14px; font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif; background-color: #f5f5fa;
	-webkit-user-select: auto;
	user-select: auto;
	-ms-touch-action: auto;
}
a { text-decoration: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
time { opacity: .75; }
aside { position: absolute; left: 0; top: 0; bottom: 0; width: 250px; background-color: #0C121A; box-shadow: 2px 0 1px rgba(0,0,0,.3); color: #fff; overflow: auto; z-index: 1; }
aside > h2 { font-size: 1.2em; }
aside a { display: block; padding: 5px 10px; color: #fff; position: relative; }
.nav-a:hover { background-color: rgba(255,255,255, .1); }
.nav-a[href*=transition], .nav-a[href*=data-title], .nav-a[href*=otherAnonymousAPIs] { margin-top: 20px; }
.nav-a[href*=autoInit], .nav-a[href*=getPage] { text-decoration: line-through; display: none; }
.nav-a[href*=getCleanUrl], .nav-a[href*=getFunction] { opacity: .6; }
.nav-a[href*=reload]:after, .nav-a[href*=remove]:after { position: absolute; content: '更新'; font-size: 12px; transform: scale(0.8); color: pink; }
.nav-a[href*=remove]:after { content: 'NEW'; }
.nav-a > .mask { display: inline; width: 26px; height: 31px; top: 0; right: 8px; left: auto; background-color: transparent; -webkit-transform: scale(.8,.8); -ms-transform: scale(.75,.75); transform: scale(.75,.75); }
.nav-a.active { background-color: rgba(0,0,0,.2); box-shadow: inset 0 -1px rgba(255,255,255, .1), inset 0 1px #000; }

.content { position: absolute; top: 0; bottom: 0; left: 250px; right: 0; padding: 20px; cursor: default; overflow: auto; }
aside, .content { -webkit-overflow-scrolling: touch; }

.download { display: inline-block; width: 280px; padding: 10px 0; background-color: #34538b; color: #fff; text-align: center; box-shadow: 3px 3px #beceeb; white-space: nowrap; }
.download:active { -webkit-transform: translate(1px,1px); -ms-transform: translate(1px,1px); transform: translate(1px,1px); box-shadow: 2px 2px #beceeb; }

.content h1 { font-size: 20px; margin-top: 10px; margin-left: 10px; }
.content h1 sub { margin-top: -20px; font-weight: normal; font-size: 12px; letter-spacing: -1px; color: #ddd; position: absolute; pointer-events: none; }
.content h2 { margin-top: 0; margin-bottom: 20px; padding: 10px; background-color: #C1D2EE; font-size: 16px; text-shadow: 1px 1px #eee; }
.content h3 { margin: 20px 0 10px; padding: 10px; background-color: #cad5eb; font-size: 14px; color: #666; }
.content p { margin: 10px; color: #565656; }
.content p:hover { color: #333; }
.content code { border: 1px solid #ddddef; background-color: #f0f0f0; border-radius: 3px; padding: 1px 4px; margin-left: 2px; margin-right: 2px; font-family: Consolas, monospace; color: #333;}
.content ol, .content ul { padding-left: 25px; }
.content li { margin-top: 10px; color: #666; }
.content li:hover { color: #333; }
code > a:hover { background-color: #f0f3f9; color: #333; text-decoration: none; }
.content pre { display: block; padding: 10px; margin: 10px; border: 1px dotted #00c; color: #00c; font-family: "Lucida Console", Monaco, monospace; white-space: pre-wrap; word-wrap: break-word; }
.content li pre { margin-left: 0; margin-right: 0; }
pre .comment { color: green; }
.content li p { margin-left: 0; margin-right: 0; }
.content tip { position: absolute; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); }
.content tip::before { content: attr(data-content); display: inline-block; padding: 0 .3em; background-color: #34538b; color:#fff; font-size: 12px; opacity: .2; }

.content table { border-spacing: 0; border-collapse: collapse; *border-collapse: separate; margin-left: 10px; color: #666; }
.content tr:hover { color: #333; }
.content th { border: 1px solid #a0b3d6; background-color: #f0f3f9; padding: 2px 10px; }
.content td { border: 1px solid #a0b3d6; padding: 2px 10px; }
.content tr:nth-of-type(even) td { background-color: #f6f6f6; }

.content .link { text-decoration: underline; color: #34538b; }
.content .link:hover { text-decoration: none; }
.content .link:active { color: #f30; }
.button { display: inline-block; padding: .5em 1em; color: #444; border: 0; border-radius: .2em; background-color: #f0f3f9; box-shadow: 1px 1px #a0b3d6, 2px 2px #a0b3d6, 3px 3px #a0b3d6, 4px 4px #a0b3d6; text-decoration: none; text-shadow: 1px 1px #f0f3f9; font-weight: 700; font-size: 12px; cursor: pointer; -webkit-transition: all .1s; transition: all .1s; }
.button:hover { background-color: #E3E8F2; color: #333; }
.button:active { -webkit-transform: translate(2px, 2px); -ms-transform: translate(2px, 2px); transform: translate(2px, 2px); box-shadow: 1px 1px #a0b3d6, 2px 2px #a0b3d6; }
.button:focus { outline: 0 none; background-color: #E3E8F2; }
.content .supplement { margin-left: 20px; color: #999; }
.content img { max-width: 100%; }

del { display: inline-block; opacity: .6; }

/* slide up */
.slideup.out {
	-webkit-animation-name: slideouttotop;
	animation-name: slideouttotop;
}
.slideup.in {
	-webkit-transform: translateY(0);
	-webkit-animation-name: slideinfrombottom;
	transform: translateY(0);
	animation-name: slideinfrombottom;
}
.slideup.in.reverse {
	-webkit-animation-name: slideinfromtop;
	animation-name: slideinfromtop;
}
.slideup.out.reverse {
	-webkit-transform: translateY(100%);
	-webkit-animation-name: slideouttobottom;
	transform: translateY(100%);
	animation-name: slideouttobottom;
}

@-webkit-keyframes slideinfromtop {
    from { -webkit-transform: translateY(-100%); }
    to { -webkit-transform: translateY(0); }
}
@keyframes slideinfromtop {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}
@-webkit-keyframes slideinfrombottom {
    from { -webkit-transform: translateY(100%); }
    to { -webkit-transform: translateY(0); }
}
@keyframes slideinfrombottom {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}
@-webkit-keyframes slideouttotop {
    from { -webkit-transform: translateY(0); }
    to { -webkit-transform: translateY(-100%); }
}
@keyframes slideouttotop {
    from { transform: translateY(0); }
    to { transform: translateY(-100%); }
}
@-webkit-keyframes slideouttobottom {
    from { -webkit-transform: translateY(0); }
    to { -webkit-transform: translateY(100%); }
}
@keyframes slideouttobottom {
    from { transform: translateY(0); }
    to { transform: translateY(100%); }
}

